{extend name="platform/new_base" /}
{block name="resources"/}
{/block}
{block name="main"}
				<!-- page -->
                <!--<form action="" class="form">
                    <div class="v-form-inline v-form-inline-auto">
                        <div class="form-group">
                            <label class="control-label">店铺类型</label>
                            <select class="form-control" id="shop_type">
                            	<option value="">全部</option>
                            	<option value="1">自营店</option>
                            	<option value="2">入驻店</option>
                            </select>
                        </div>
                        <div class="form-group date-form-group">
                            <label class="control-label">下单时间</label>
                            <div class="date-input-group" >
                                <div class="date-input-control">
                                    <input type="text" class="form-control" id="startDate" placeholder="开始时间" value="{$start_date}"><i class="icon icon-calendar"></i>
                                </div>
                                <span class="date-input-group-addon">~</span>
                                <div class="date-input-control">
                                    <input type="text" class="form-control" id="endDate" placeholder="结束时间" value="{$end_date}"><i class="icon icon-calendar"></i>
                                </div>
                            </div>
                        </div>
                        <div class="form-group">
                            <a class="btn btn-primary search"><i class="icon icon-search "></i> 搜索</a>
                        </div>
                    </div>
                </form>-->
<form class="v-filter-container">
    <div class="filter-fields-wrap">
        <div class="filter-item clearfix">
            <div class="filter-item__field">
                <div class="v__control-group">
                    <label class="v__control-label">店铺类型</label>
                    <div class="v__controls">
                        <select class="v__control_input" id="shop_type">
                            <option value="">全部</option>
                            <option value="1">自营店</option>
                            <option value="2">入驻店</option>
                        </select>
                    </div>
                </div>
                <div class="v__control-group">
                    <label class="v__control-label">下单时间</label>
                    <div class="v__controls v-date-input-control">
                        <label for="orderTime">
                            <input type="text" class="v__control_input pr-30" id="orderTime" placeholder="请选择时间" autocomplete="off" data-types="datetime">
                            <i class="icon icon-calendar"></i>
                            <input type="hidden" id="startDate">
                            <input type="hidden" id="endDate">
                        </label>
                    </div>
                </div>

            </div>
        </div>
        <div class="filter-item clearfix">
            <div class="filter-item__field">
                <div class="v__control-group">
                    <label class="v__control-label"></label>
                    <div class="v__controls">
                        <a class="btn btn-primary search"><i class="icon icon-search"></i> 搜索</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</form>

                <div class="screen-title">
                    <span class="text">数据列表</span>
                </div>
                <div class="flex-auto-center mb-20 bg-info text-center border-info">
                    <div class="flex-1 padding-15">
                        <h3 class="strong">交易额</h3>
                        <p id="sale_money"></p>
                    </div>
                    <div class="flex-1 padding-15">
                        <h3 class="strong">订单量</h3>
                        <p id="sale_num"></p>
                    </div>
                    <div class="flex-1 padding-15">
                        <h3 class="strong">付款订单</h3>
                        <p id="order_pay"></p>
                    </div>
                    <div class="flex-1 padding-15">
                        <h3 class="strong">售后订单</h3>
                        <p id="order_return"></p>
                    </div>
                </div>
				<ul class="nav nav-tabs v-nav-tabs" role="tablist">
                    <li role="presentation" class="active"><a href="#order" aria-controls="order" role="tab" data-toggle="tab" class="flex-auto-center">订单量</a></li>
                    <li role="presentation"><a href="#trade" aria-controls="trade" role="tab" data-toggle="tab" class="flex-auto-center">交易额</a></li>
                </ul>
                <div class="tab-content pt-15">
                	<div role="tabpanel" class="tab-pane h-500 fade in active" id="order" ></div>
                	<div role="tabpanel" class="tab-pane h-500 fade" id="trade" ></div>
                </div>
				<!-- page end -->
<input type="hidden" id="start_time" value="{$start_date}">
<input type="hidden" id="end_time" value="{$end_date}">
{/block}
{block name="script"}
<script>
require(['util'],function(util){
    // util.layDate('#startDate');
    // util.layDate('#endDate');
    util.layDate('#orderTime',true,function(value, date, endDate){
        var h=date.hours<10 ?"0"+date.hours : date.hours;
        var m=date.minutes<10 ?"0"+date.minutes : date.minutes;
        var s=date.seconds<10 ?"0"+date.seconds : date.seconds;
        var h1=endDate.hours<10 ?"0"+endDate.hours : endDate.hours;
        var m1=endDate.minutes<10 ?"0"+endDate.minutes : endDate.minutes;
        var s1=endDate.seconds<10 ?"0"+endDate.seconds : endDate.seconds;
        var date1=date.year+'-'+date.month+'-'+date.date+' '+h+":"+m+":"+s;
        var date2=endDate.year+'-'+endDate.month+'-'+endDate.date+' '+h1+":"+m1+":"+s1;

        if(value){
            $('#startDate').val(date1);
            $('#endDate').val(date2);
        }
        else{
            $('#startDate').val('');
            $('#endDate').val('');
        }

    });
    getOrderCount();
    function getOrderCount(){
        var startDate = $("#startDate").val();
        var endDate = $("#endDate").val();
        if(startDate=='' || endDate==''){
            startDate = $("#start_time").val();
            endDate = $("#end_time").val();
        }
        $.ajax({
            type : "post",
            url : "{:__URL('PLATFORM_MAIN/Statistics/getOrderAccount')}",
            async : true,
            data : {
                "start_date":startDate,"end_date":endDate,"shop_type":$("#shop_type").val()
            },
            success : function(data) {
                $("#sale_money").html(data.sale_money);
                $("#sale_num").html(data.sale_num);
                $("#order_pay").html(data.order_pay);
                $("#order_return").html(data.order_return);
            }
        })
    }
    loading();
    function loading(){
        var startDate = $("#startDate").val();
        var endDate = $("#endDate").val();
        if(startDate=='' || endDate==''){
            startDate = $("#start_time").val();
            endDate = $("#end_time").val();
        }
        $.ajax({
            type : "post",
            url : "{:__URL('PLATFORM_MAIN/statistics/businessProfile')}",
            async : true,
            data:{"start_date":startDate,"end_date":endDate,"shop_type":$("#shop_type").val()},
            success : function(data) {
                var orderOption = {
                    title: {
                        text: ''
                    },
                    tooltip: {
                        trigger: 'axis'
                    },
                    legend: {
                        data:['订单量','付款订单','售后订单']
                    },
                    grid: {
                        left: '3%',
                        right: '4%',
                        bottom: '3%',
                        containLabel: true
                    },

                    xAxis: {
                        type: 'category',
                        boundaryGap: false,
                        data: data[0]
                    },
                    yAxis: {
                        type: 'value',
                        name:'数量',
                    },
                    series: [
                        {
                            name:'订单量',
                            type:'line',
                            // stack: '总量',
                            data:data[1][0]['data']
                        },
                        {
                            name:'付款订单',
                            type:'line',
                            // stack: '总量',
                            data:data[1][1]['data']
                        },
                        {
                            name:'售后订单',
                            type:'line',
                            // stack: '总量',
                            data:data[1][2]['data']
                        }
                    ]
                };
                util.chart('order',orderOption);
            }
        });
    }
	$('a[href="#trade"]').on('shown.bs.tab', function (e) {
        var startDate = $("#startDate").val();
        var endDate = $("#endDate").val();
        if(startDate=='' || endDate==''){
            startDate = $("#start_time").val();
            endDate = $("#end_time").val();
        }
        $.ajax({
                type : "post",
                url : "{:__URL('PLATFORM_MAIN/statistics/businessProfile')}",
                async : true,
                data:{"start_date":startDate,"end_date":endDate,"shop_type":$("#shop_type").val()},
                success : function(data) {
                    var tradeOption = {
                        title: {
                            text: ''
                        },
                        tooltip: {
                            trigger: 'axis'
                        },
                        legend: {
                            data:['交易额']
                        },
                        grid: {
                            left: '3%',
                            right: '4%',
                            bottom: '3%',
                            containLabel: true
                        },
                        xAxis: {
                            type: 'category',
                            boundaryGap: false,
                            data: data[0]
                        },
                        yAxis: {
                            type: 'value',
                            name:'数量'
                        },
                        series: [
                            {
                                name:'交易额',
                                type:'line',
                                stack: '总额',
                                data:data[2][0]['data']
                            }
                        ]
                    };
                    util.chart('trade',tradeOption)
                }
            });
	})
    $('.search').on('click',function(){
        $('.nav-tabs li:eq(0) a').tab('show');
        getOrderCount();
        loading();
    })
	
})
</script>
{/block}